<!DOCTYPE html>
<!-- saved from url=(0031)http://es.cga.com.cn/clan/index -->
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">


 	<#include "/app/es/common/common_css.ftl">

	 	 
 	
	<title>ES赛事平台</title>
	<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<style>
body {
	height: 100%;
}
html {
	height: 100%;
}
.swiper-container {
	height: 100%;
}
.swiper-wrapper {
	width: 100%;
}
.swiper-slide {
	width: 100%;
}
span.loadingIcon{
	width: 25px;
}
span.pullUpLabel{
	width: auto;
}
</style>

</head>

<script>
    var DOMAIN ='http://static.es.cga.com.cn';
    var WEB_DOMAIN = 'http://es.cga.com.cn';
    var isNickEmpty = false;
</script>

<body>
 
	 <header>
	    <a class="back" href="javascript:history.back(-1);">返回</a>
		<h1>ES赛事平台</h1>
		 <span class="lnk createClan"  >创建团队</span>
	 </header>
		
		<div class="content team swiper-container swiper-free-mode">
		    <div class="team_list swiper-wrapper" style="padding-top: 0px; padding-bottom: 100px; width: 320px; height: 418px;">
		    	<div class="swiper-slide swiper-slide-visible swiper-slide-active">
					<div class="team_search">
				    	<span class="ipt_search">
				            <input name="clan" type="text" placeholder="请输入战队名称" value="" class="clan_input" data-val="请输入战队名">
				        </span>
				    	<a class="lnk_search clan_search" href="javascript:;">搜索战队</a>
				    </div>
			    	<h2><span class="t1">战队名称</span><span class="t2">战队队长</span></h2>
		        </div>
		        <ul class="swiper-slide swiper-slide-visible">
						   <#if dataList?exists>
						 		<#list dataList as x>
									<li><span class="t1">${x.name}</span><span class="t2"></span><a href="javascript:;" class="lnk_style joinClan" data-id="${x.id}">加入战队</a></li>
								</#list>
							</#if>	
		 
				         </ul>
		            </div>
		</div>
		<div class="loading" id="pullLoading">
		    <span class="loadingIcon"></span><span class="pullUpLabel">加载中...</span>
		</div>
		
		      	
		<div class="mask_div"></div>
		
		<div class="popup pop_window" style="display:none;">
		    <h2 class="pop_tit pop_title"><strong class="pop_window_title">CGA赛事 | 提示</strong><a href="javascript:;" class="lnk_close window_close">关闭</a></h2>
		    <div class="pop_inner popup_inner">
		    </div>
		    <div class="pop_widget">
		        <a href="javascript:;" class="lnk_style window_submit">确定</a>
		    </div>
		</div>
		
		
		 	<#assign tabbarSelect="event">
		    <#include "/app/es/common/tabbar.ftl" />
		    
			<#include "/app/es/common/common_js.ftl">
			

		
		<style>
		.submit{display:none;}
		.corps_mod .c_avatar{ display:inline-block;}
		</style>
		
		<!--pop S-->
		<div id="set_clan" class="popup" style="display:none;">
		        <div class="nick_mod clan_mod">
		            <p class="txt">
		                请输入战队名称
		            </p>
		            <p class="ipt"><input name="clan" type="text" maxlength="16" value=""></p>
		            <p class="error tip"></p>
		            <input type="submit" class="submit">
		        </div>
		</div>
		<!--pop E-->

 <script type="text/javascript">
		var maxPageNum="${pagination.totalPage}";//后台传入
		var num = ${pagination.currentPage}+1; //计数器初始化为1
		var mySwiper = new Swiper('.swiper-container',{
			  slidesPerView:'auto',
			  mode:'vertical',
			  watchActiveIndex: true,
			  freeMode : true,
		 	  offsetPxAfter : 100,
			  onTouchStart: function() {
			    holdPosition = 0;
			  },
			  onResistanceAfter: function(s, pos){
			    holdPosition = pos;
			  },
			  onTouchEnd: function(){
			    if (holdPosition>80 && num>0) {
		          mySwiper.params.onlyExternal=true;
		          mySwiper.appendSlide($(".loading").html(),'loading swiper-slide');
		          mySwiper.swipeNext();
				  loadNewSlides();
			    }
			  }
		}); 
		function loadNewSlides(){
				if(num>0 && num<maxPageNum){
				    setTimeout(function(){
						$.get("<@context/>es/esteamrest/teamsAjax.do?pageId="+num,function(result){
							t = setTimeout(function(){
								if(result.length>0){
									num++;
									mySwiper.removeLastSlide();
									mySwiper.appendSlide(result,'swiper-slide','ul');
								    mySwiper.params.onlyExternal=false;
								}else{
									num = 0;
									mySwiper.removeLastSlide();
									mySwiper.params.onlyExternal=false;
								}
							},1);
						});
				    },300)
				}
			  } 
 
		
	$(function(){
	    $(document).on("mouseenter",".team_list li",function(){
	        $(this).parent().find("li[class='active']").removeClass('active');
	        $(this).addClass('active'); //将点击的li设置高亮样式
	    });
	    $(document).on("mouseleave",".team_list li",function(){
	        $(this).parent().find("li[class='active']").removeClass('active');
	    });
	
		//默认搜索提示内容
		var searchVal = $(".clan_input").val();	
		if(!searchVal ){
			$(".clan_input").val($(".clan_input").data("val"));	
		}
	
	    $(document).on("click",".joinClan",function(){
	        var isLogin = Html.login('/clan/my');
	        if(isLogin===true){
	            var clanId = $(this).data("id");
	            if(clanId){
	                Func.ajax('/clan/joinClan',{'clanId':clanId},callBack);
	            }
	        }
	    });
	
	});
	
	//搜索 S
	$(".clan_input").focus(function(){
		var curVal = $(this).val();
		if(curVal==$(this).data("val") ){
			$(this).val('');	
		}
	});
	
	$(".clan_input").keydown(function(e){
		var curKey = e.which;
		if(curKey == 13){
			$(".clan_search").click();
		}
	});
	$(".clan_search").click(function(){
		var curVal = $(".clan_input").val();
		if(!curVal || curVal==$(".clan_input").data("val")){
	        curVal= '';
		}
	    if(curVal){
	        window.location.href = '/clan/index?clan='+curVal;
	    }else{
	        window.location.href = '/clan/index';
	    }
	});
	//搜索 E
	
	$(".createClan").click(function(){
	    var newHtml = $("#set_clan").html();
	    Html.showWindow("创建战队",null,null,newHtml);
	});
	$(document).on("click",".clan_mod .submit",function(){
	    var str = $(".pop_window input").val();
	    if( str==''){
	        $("input[name='clan']").val('');
	        Html.tipStatus($(".pop_window .tip"),'error','请输入战队名称');
	        return;
	    }
	    if(str.length>8){
	        Html.tipStatus($(".pop_window .tip"),'error','战队名称不能超过8个字');
	        return;
	    }
	    var patrn = /[^0-9a-zA-Z\u4e00-\u9fa5]/;
	    if(patrn.exec(str)){
	        Html.tipStatus($(".pop_window .tip"),'error','战队名称只能为中文，字母或数字');
	        return;
	    }
	    Html.tipStatus($(".pop_window .tip"),null,'正在提交...');
	    Func.ajax('/clan/UpdateClan',{'clanName':str},createCallBack);
	});
	
	function createCallBack(ret){
	    if(ret.errno){
	        Html.tipStatus($(".pop_window .tip"),null,'操作失败,'+ret.data);
	    }else{
	        Html.alert(ret.data,'ok','/clan/my');
	    }
	}
	
	function callBack(ret){
	    if(ret.errno){
	        Html.alert('操作失败,'+ret.data,'error','reload');
	    }else{
	        ret.data = ret.data?ret.data:'操作成功';
	        Html.alert(ret.data,'ok','reload');
	    }
	}

</script>

</body>
</html>